// pages/myToast.js
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    showModalStatus: {
      type: Boolean,
      value: false,
      observer: "_propertyChange"
    },
    word:{
      type:String,
      value:'',
      observer:"_wordChange"
    },
    icon: {
      type: Number,
      value: 1,
      observer: "_iconChange"
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    showModalStatus: false,
    word:"",
    iconPath:"/pages/images/tip_img.png"
  },

  /**
   * 组件的方法列表
   */
  methods: {
    _iconChange: function (newVal, oldVal){
      console.log(newVal);
      if (newVal==1){
        this.setData({
          iconPath: "/pages/images/tip_img.png"
        })
      }else{
        this.setData({
          iconPath: "/pages/images/tip_img2.png"
        })
      }
    },
    _wordChange: function (newVal, oldVal){
      this.setData({
        word: newVal
      })
    },
    _propertyChange: function (newVal, oldVal) {
      
      if (newVal) {
        this.util('open')
        
      } else {
        this.util('close')
      }
    },
    powerDrawer: function (e) {
      var currentStatu = e.currentTarget.dataset.statu;
      this.util(currentStatu)
    },
    util: function (currentStatu) {
      /* 动画部分 */
      // 第1步：创建动画实例 
      var animation = wx.createAnimation({
        duration: 200, //动画时长 
        timingFunction: "linear", //线性 
        delay: 0 //0则不延迟 
      });

      // 第2步：这个动画实例赋给当前的动画实例 
      this.animation = animation;

      // 第3步：执行第一组动画 
      animation.backgroundColor(255, 255, 255,0).rotateX(-100).step();

      // 第4步：导出动画对象赋给数据对象储存 
      this.setData({
        animationData: animation.export()
      })

      // 第5步：设置定时器到指定时候后，执行第二组动画 
      setTimeout(function () {
        // 执行第二组动画 
        animation.backgroundColor(255,255,255,0.8).rotateX(0).step();
        // 给数据对象储存的第一组动画，更替为执行完第二组动画的动画对象 
        this.setData({
          animationData: animation.export()
        })

        //关闭 
        if (currentStatu == "close") {
          this.setData(
            {
              showModalStatus: false
            }
          );
        }
      }.bind(this), 200)

      // 显示 
      if (currentStatu == "open") {
        this.setData(
          {
            showModalStatus: true
          }
        );
      }
    }
  }
})
